<template>
<view>
<!--pages/index/public/public.wxml-->
<template name="model">
<!-- 底部菜单 -->
<view class="pos_fixed">
    <view class="tpd-footer tpd-footer2" v-if="menu_model.length>0">
       <block v-for="(item, index) in menu_model" :key="index">
        <view hover-class="none" @tap.stop="topage" data-obj="custom" :data-idx="index" :class="page == index?'tpd-footer-select':''"><image :src="page == index?url + item.pic2:url + item.pic1"></image><text :style="'color:' + (page == index?item.navFontColor:'')">{{item.title_name}}</text></view>  
        </block> 
    </view>

    <view class="tpd-footer tpd-footer1" v-if="defaultMenu">
        <view hover-class="none" @tap.stop="topages" data-idx="0" :class="page == 0?'tpd-footer-select':''"><image :src="page == 0?'/images/home2.png':'/images/home1.png'"></image><text>首页</text></view>
        <view hover-class="none" @tap.stop="topages" data-idx="1" :class="page == 1?'tpd-footer-select':''"><image :src="page == 1?'/images/category2.png':'/images/category1.png'"></image><text>分类</text></view>
        <view hover-class="none" @tap.stop="topages" data-idx="4" :class="page == 4?'tpd-footer-select':''"><image :src="page == 4?'/images/play2.png':'/images/play1.png'"></image><text>直播</text></view>
        <view hover-class="none" @tap.stop="topages" data-idx="2" :class="page == 2?'tpd-footer-select':''"><image :src="page == 2?'/images/cart2.png':'/images/cart1.png'"></image><text>购物车</text></view>
        <view hover-class="none" @tap.stop="topages" data-idx="3" :class="page == 3?'tpd-footer-select':''"><image :src="page == 3?'/images/user2.png':'/images/user1.png'"></image><text>我的</text></view>
    </view>
  </view>
</template>



<template name="distributMenu">
<!-- 底部菜单 -->
<view class="pos_fixed">
    <!-- 我的分销底部导航 -->
    <view class="tpd-footer tpd-footer1">
        <view hover-class="none" @tap.stop="distributTopages" data-idx="0" :class="page == 0?'tpd-footer-select':''"><image :src="page == 0?'/images/distribut/seller_red@2x.png':'/images/distribut/seller_black@2x.png'"></image><text>分销中心</text></view>
        <view hover-class="none" @tap.stop="distributTopages" data-idx="1" :class="page == 1?'tpd-footer-select':''"><image style="width:59rpx;" :src="page == 1?'/images/distribut/team_red@2x.png':'/images/distribut/team_black@2x.png'"></image><text>我的团队</text></view>
        <view hover-class="none" @tap.stop="distributTopages" data-idx="2" :class="page == 2?'tpd-footer-select':''"><image :src="page == 2?'/images/distribut/money_red@2x.png':'/images/distribut/money_black@2x.png'"></image><text>我的账户</text></view>
        <view hover-class="none" @tap.stop="distributTopages" data-idx="3" :class="page == 3?'tpd-footer-select':''"><image :src="page == 3?'/images/distribut/order_red@2x.png':'/images/distribut/order_black@2x.png'"></image><text>分销订单</text></view>
        <view hover-class="none" @tap.stop="distributTopages" data-idx="4" :class="page == 4?'tpd-footer-select':''"><image :src="page == 4?'/images/distribut/shop_red@2x.png':'/images/distribut/shop_black@2x.png'"></image><text>我的网店</text></view>
    </view>
  </view>
</template>
</view>
</template>

<script>

export default {
  data() {
    return {};
  },

  components: {},
  props: {},

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {},

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {},

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {},

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {},

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {},

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {},

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {},

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {},
  methods: {}
};
</script>
<style>
/* pages/index/publics/publics.wxss */

.tpd-footer{
    border-top: 1px solid #f3f3f3;
    height:105rpx;
    background-color: #fff;
    overflow: hidden;
    justify-content:space-around;
    display:flex;
}
.tpd-footer view{
    float: left;
    padding-top:10rpx;
    text-align: center;
}
.tpd-footer image{
    display: block;
    margin: 0 auto;
    width: 48rpx;
    height: 48rpx;
}
.tpd-footer text{
    display: block;
    height: 48rpx;
    margin-bottom: 12rpx;
    font-size: 24rpx;
    line-height: 48rpx;
    color: #999;
}
.tpd-footer-select text{
    color: #ff6a00;
}
.tpd-footer1 view{
    width: 25%;
}
.tpd-footer2 view{
    width: 20%;
}
.pos_fixed{
    width: 100%;
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 999;  
}

</style>